<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>phpkrpano</title>
    <link rel="stylesheet" href="/css/bootstrap.min.css">
    <link rel="stylesheet" href="/css/bootstrap-table.min.css">
    <script src="/js/plugins/jquery.min.js"></script>
    <script src="/js/plugins/popper.min.js"></script>
    <script src="/js/plugins/bootstrap.min.js"></script>
    <script src="/js/plugins/bootstrap-table.min.js"></script>
    <script src="/js/plugins/bootstrap-table-zh-CN.js"></script>
</head>
<body>
<button id="_make" type="button" class="btn btn-primary">制作全景图</button>
<table id="table"></table>

<script>
    var tableData = [];
    $.ajax({
        url: '/api/table',
        type: "GET",
        dataType: "json",
        error: function (error) {
            console.log(error)
        },
        success: function (data) {
            console.log(data);
            buildTable(data);
        }
    })

    function buildTable(result) {
        for (var i in result) {
            var data = result[i];
            console.log(data);
            tableData.push({title: i, operate: "edit", url: data})
        }

        table = $('#table').bootstrapTable({
            columns: [{
                field: 'title',
                title: '主题'
            }, {
                field: 'operate',
                title: '操作',
                formatter: operateFormatter
            }],
            data: tableData
        });
    }


    function operateFormatter(value, row, index) {
        var e = tableData[index]
        var title = e.title;
        return [
            '<button id="btn_detail" type="button" class="RoleOfA btn-default bt-select" onclick="findByTitle(' + title + ')">预览</button>',
            '<button id="btn_detail" type="button" class="RoleOfA btn-default bt-select" onclick="update(' + title + ')">编辑</button>',
            '<button id="btn_detail" type="button" class="RoleOfA btn-default bt-remove" onclick="deleted(' + title + ')">删除</button>',
        ].join('');
    }


    function update(title) {
        console.log(title);
        var url = "/data/" + title + "/vtour/tour_editor.html?title=" + title + "&random=" + Math.random();
        window.location = url;
    }

    function findByTitle(title) {
        console.log(title);
        var url = "/data/" + title + "/vtour/tour.html?title=" + title + "&random=" + Math.random();
        window.location = url;
    }


    function deleted(title) {
        $.ajax({
            url: '/php/Remove.php?key=' + title,
            type: "GET",
            dataType: "json",
            error: function (error) {
                console.log(error)
            },
            success: function (data) {
                console.log(data);
                window.location = "/main";
            }
        })
    }

    $("#_make").click(function () {
        window.location = "/add";
    });


</script>


</body>
</html>